import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _applyDecoratedDescriptor from "@babel/runtime/helpers/esm/applyDecoratedDescriptor";
import _isEmpty from "lodash/isEmpty";

var _dec, _dec2, _dec3, _dec4, _dec5, _class, _class2;

import React from 'react';
import { connect } from 'dva';
import { Form, Button, Select, Input, Row, Col } from 'antd';
import { Bind } from 'lodash-decorators';
import 'codemirror/mode/clike/clike';
import { Header, Content } from 'components/Page';
import intl from 'utils/intl';
import formatterCollections from 'utils/intl/formatterCollections';
import notification from 'utils/notification';
import CodeMirror from 'components/CodeMirror';
var Option = Select.Option;
var FormItem = Form.Item;
var Glue = (_dec = Form.create({
  fieldNameProp: null
}), _dec2 = formatterCollections({
  code: 'csdr.jobInfo'
}), _dec3 = connect(function (_ref) {
  var loading = _ref.loading,
      jobInfo = _ref.jobInfo;
  return {
    updating: loading.effects['jobInfo/updateJobGlue'],
    jobInfo: jobInfo
  };
}), _dec4 = Bind(), _dec5 = Bind(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = /*#__PURE__*/function (_React$PureComponent) {
  _inherits(Glue, _React$PureComponent);

  var _super = _createSuper(Glue);

  function Glue(props) {
    var _this;

    _classCallCheck(this, Glue);

    _this = _super.call(this, props);
    _this.codeMirrorEditor = void 0;
    _this.state = {
      glueSource: ''
    };
    return _this;
  }

  _createClass(Glue, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      this.queryJobInfo();
    }
    /**
     * @function queryJobInfo - 查询job详情
     */

  }, {
    key: "queryJobInfo",
    value: function queryJobInfo() {
      var _this2 = this;

      var _this$props = this.props,
          dispatch = _this$props.dispatch,
          id = _this$props.match.params.id;
      dispatch({
        type: 'jobInfo/queryJobInfo',
        payload: {
          id: id
        }
      }).then(function (res) {
        if (res) {
          _this2.setState({
            glueSource: res.glueSource
          });

          dispatch({
            type: 'jobInfo/queryJobGlueList',
            payload: {
              jobId: id
            }
          });
        }
      });
    }
    /**
     * @function queryJobGlueDetail - 查询glue详情
     */

  }, {
    key: "queryJobGlueDetail",
    value: function queryJobGlueDetail(params) {
      var _this3 = this;

      var _this$props2 = this.props,
          dispatch = _this$props2.dispatch,
          id = _this$props2.match.params.id,
          form = _this$props2.form;
      form.resetFields();
      dispatch({
        type: 'jobInfo/queryJobGlueDetail',
        payload: {
          id: params || id
        }
      }).then(function (res) {
        if (res) {
          _this3.setState({
            glueSource: res.glueSource
          });

          dispatch({
            type: 'jobInfo/queryJobGlueList',
            payload: {
              jobId: id
            }
          });
        }
      });
    }
    /**
     * @function handleSave - 保存
     */

  }, {
    key: "handleSave",
    value: function handleSave() {
      var _this4 = this;

      var _this$props3 = this.props,
          form = _this$props3.form,
          dispatch = _this$props3.dispatch,
          _this$props3$jobInfo$ = _this$props3.jobInfo.jobInfoDetail,
          jobInfoDetail = _this$props3$jobInfo$ === void 0 ? {} : _this$props3$jobInfo$,
          id = _this$props3.match.params.id;
      var glueRemark = jobInfoDetail.glueRemark,
          glueType = jobInfoDetail.glueType,
          glueTypeMeaning = jobInfoDetail.glueTypeMeaning,
          jobId = jobInfoDetail.jobId;
      var content = '';

      if (this.codeMirrorEditor) {
        content = this.codeMirrorEditor.getValue();
      }

      form.validateFields(function (err, fieldsValue) {
        if (_isEmpty(err)) {
          dispatch({
            type: 'jobInfo/updateJobGlue',
            payload: _objectSpread({
              glueRemark: glueRemark,
              glueSource: content,
              glueType: glueType,
              glueTypeMeaning: glueTypeMeaning,
              jobId: jobId || id
            }, fieldsValue)
          }).then(function (res) {
            if (res) {
              notification.success();

              _this4.queryJobInfo();
            }
          });
        }
      });
    }
    /**
     * @function setCodeMirror - 获取CodeMirror实例
     * @param {object} editor - CodeMirror实例
     */

  }, {
    key: "setCodeMirror",
    value: function setCodeMirror(editor) {
      this.codeMirrorEditor = editor;
    }
    /**
     * 编辑代码后更新数据
     * @param {object} editor - 编辑器对象
     * @param {object} data - 数据对象
     * @param {string} value - 编辑后的代码
     */

  }, {
    key: "codeChange",
    value: function codeChange(editor, data, value) {
      this.setState({
        glueSource: value
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this5 = this;

      var _this$props4 = this.props,
          form = _this$props4.form,
          _this$props4$jobInfo = _this$props4.jobInfo,
          _this$props4$jobInfo$ = _this$props4$jobInfo.jobInfoDetail,
          jobInfoDetail = _this$props4$jobInfo$ === void 0 ? {} : _this$props4$jobInfo$,
          _this$props4$jobInfo$2 = _this$props4$jobInfo.glueList,
          glueList = _this$props4$jobInfo$2 === void 0 ? [] : _this$props4$jobInfo$2,
          updating = _this$props4.updating;
      var glueRemark = jobInfoDetail.glueRemark,
          glueTypeMeaning = jobInfoDetail.glueTypeMeaning,
          jobDesc = jobInfoDetail.jobDesc;
      var getFieldDecorator = form.getFieldDecorator;
      var glueSource = this.state.glueSource;
      var codeMirrorProps = {
        value: glueSource,
        options: {
          mode: 'text/x-java'
        },
        onBeforeChange: this.codeChange
      };
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
        title: "GLUE",
        backPath: "/csdr/job-info"
      }, /*#__PURE__*/React.createElement(Select, {
        onChange: function onChange(value) {
          return _this5.queryJobGlueDetail(value);
        },
        style: {
          width: '200px'
        },
        placeholder: intl.get('csdr.jobInfo.model.jobInfo.version').d('版本回溯')
      }, glueList.map(function (item) {
        return /*#__PURE__*/React.createElement(Option, {
          label: "".concat(item.glueTypeMeaning, "\uFF1A").concat(item.glueRemark),
          value: item.id,
          key: item.id
        }, "".concat(item.glueTypeMeaning, "\uFF1A").concat(item.glueRemark));
      })), /*#__PURE__*/React.createElement(Button, {
        type: "primary",
        icon: "save",
        style: {
          marginLeft: 10
        },
        loading: updating,
        onClick: this.handleSave
      }, intl.get('cpaas.common.button.save').d('保存'))), /*#__PURE__*/React.createElement(Content, {
        description: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, intl.get('csdr.jobInfo.model.jobInfo.glueTypeMeaning').d('运行模式'), "\uFF1A", glueTypeMeaning), /*#__PURE__*/React.createElement("span", {
          style: {
            marginLeft: '8px'
          }
        }, intl.get('csdr.jobInfo.model.jobInfo.jobDesc').d('任务描述'), "\uFF1A", jobDesc))
      }, /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
        span: 12
      }, /*#__PURE__*/React.createElement("p", {
        style: {
          fontWeight: 'bold'
        }
      }, intl.get('csdr.jobInfo.model.jobInfo.operationMode').d('运行模式：')), /*#__PURE__*/React.createElement(CodeMirror, {
        codeMirrorProps: codeMirrorProps,
        fetchCodeMirror: function fetchCodeMirror(editor) {
          return _this5.setCodeMirror(editor);
        }
      }))), /*#__PURE__*/React.createElement(Form, null, /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
        span: 12
      }, /*#__PURE__*/React.createElement(FormItem, {
        label: intl.get('csdr.jobInfo.model.jobInfo.glueRemark').d('源码备注')
      }, getFieldDecorator('glueRemark', {
        initialValue: glueRemark,
        rules: [{
          type: 'string',
          required: true,
          message: intl.get('cpaas.common.validation.notNull', {
            name: intl.get('csdr.jobInfo.model.jobInfo.glueRemark').d('源码备注')
          })
        }, {
          max: 30,
          message: intl.get('csdr.jobInfo.view.validation.glueRemark').d('源码备注长度在30个字符以内')
        }]
      })( /*#__PURE__*/React.createElement(Input, null))))))));
    }
  }]);

  return Glue;
}(React.PureComponent), (_applyDecoratedDescriptor(_class2.prototype, "handleSave", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "handleSave"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "codeChange", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "codeChange"), _class2.prototype)), _class2)) || _class) || _class) || _class);
export { Glue as default };